import {
  Component,
  OnInit,
  ViewEncapsulation,
  ChangeDetectionStrategy,
  ViewChild,
  ElementRef,
  AfterViewInit, OnDestroy
} from '@angular/core';
import {SeedInfiniteScroll} from "@shared/components/infinite-scroll/seed-infinite-scroll/seed-infinite-scroll.component";
import {Content} from "@shared/components/toolbar/toolbar-content";

import {ToolsService} from "@shared/service/tools/tools.service";
import {AuthService} from "@shared/service/auth/auth.service";
import {CrowdService} from "@crowd/crowd.service";
import {CrowdBaseBeanH5VO} from "../../../interface";

@Component({
  selector: 'seed-my-crowd',
  templateUrl: './my-crowd.component.html',
  styleUrls: ['./my-crowd.component.scss'],
  encapsulation: ViewEncapsulation.None,
})
export class MyCrowdComponent implements OnInit, AfterViewInit, OnDestroy {

  public statusList: any = [
    {name: '我发起的', statusCode: ''},
    {name: '我参与的', statusCode: 1}
  ];
  public myCrowd: any;
  public params: any = {
    'status': '',
    'userId': '',
    'page': 1,
    'rows': 10
  };
  public isActive = 0;
  public ngUnsubscrible: any;
  private userId: string;
  public showImg = true;
  public onImg = false;
  public crowdList: Array<CrowdBaseBeanH5VO> = [];
  @ViewChild('orderNav') orderNav: ElementRef;
  @ViewChild(Content) content;
  @ViewChild(SeedInfiniteScroll) infiniteScroll;

  constructor(public crowdService: CrowdService,
              private toolsService: ToolsService,
              private authService: AuthService
  ) {
    this.userId = this.authService.getUserId();
  }

  ChangeStatus(idx, statusCode) {
    this.myCrowd = this.statusList[idx].name;
    this.isActive = idx;
    this.params['page'] = 1;
    this.params['status'] = statusCode;
    this.params['userId'] = this.userId; // seedp13313(this.userId)
    this.crowdList = [];
    if (this.infiniteScroll) {
      this.infiniteScroll.enable(true);
    }
    // this.infiniteScroll &&
    // this.infiniteScroll.enable(true);
    this.getMyCrowdList(this.params['status']);

  }

  getMyCrowdList(statusCode) {
    if (statusCode === '') {
      this.ngUnsubscrible = this.crowdService.getMyCrowdList(this.params).subscribe((res) => {
        if (res.result === '0' && res.data && res.data.list.length > 0) {
          this.params['page']++;
          this.infiniteScroll.complete();
          if (res.data.hasNextPage === false) {
            this.infiniteScroll.enable(false);
          }
          this.crowdList = [...this.crowdList, ...res.data.list];
        }
      });
    } else if (statusCode === '1') {
      this.ngUnsubscrible = this.crowdService.getMyAttendList(this.params).subscribe((res) => {
        if (res.result === '0' && res.data && res.data.list.length > 0) {
          this.params['page']++;
          this.infiniteScroll.complete();
          if (res.data.hasNextPage === false) {
            this.infiniteScroll.enable(false);
          }
          this.crowdList = [...this.crowdList, ...res.data.list];
        }
      });
    }
  }

  ngAfterViewInit() {
    this.ChangeStatus(0, this.params['status']);
  }

  ngOnInit() {
  }

  ngOnDestroy() {
    this.ngUnsubscrible.unsubscribe();
  }
}
